<template>
    <div>
        <page-main class="header" style="height: 100px;">
            <div style="margin-top: 28px; float: left;">
                <span id="titleBox" style="font-size: 20px; font-weight: bolder; display: block;">{{ title }}</span><br/>
                <span>发布人：<span>{{ author }}</span>
                    &nbsp;&nbsp;发布时间:
                    <span>{{ createTime }}</span></span>
            </div>
            <div style="float: right; margin-top: 28px;">
                <router-link :to="{name: 'AnnouncementIndex'}">
                    <el-button type="primary" icon="el-icon-back" size="small">返回</el-button>
                </router-link>
            </div>
        </page-main>
        <div style="padding: 0 22px;">
            <span v-for="(item,idx) in contentList" :key="idx">{{ item }}<br/></span>
        </div>
    </div>
</template>

<script>
export default {
    name: 'AnnouncementDetails',
    data() {
        return {
            title: '',
            author: '',
            createTime: '',
            content: '',
            contentList: []
        }
    },
    created() {
        this.title = this.$route.query.title
        this.author = this.$route.query.author
        this.createTime = this.$route.query.createTime
        this.content = this.$route.query.content
        this.contentList = this.content.split('\r\n')
    }
}
</script>

<style lang="scss" scoped>
.header {
    color: #595959;
    position: relative;
    padding: 0 15px;
    border-bottom: 1px solid #f6f6f6;
    border-radius: 2px 2px 0 0;
    font-size: 14px;
}
* {
    font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}
</style>
